/**
 * Created by lenovo on 2017/5/9.
 * 所有的评论信息、包括回复评论的组件
 * 组件：
 * 1、评论图片组件（EvaluatePic.react）
 * 2、特定评论项目组件（EvaluateSpecialItem.react）
 * 3、回复评论组件（EvaluateReply.react）
 */
import React from 'react';
import EvaluateReply from './evaluateReply.react';
import EvaluateSpecialItem from './evaluateSpecialItem.react';
import EvaluatePic from './evaluatePic.react';

class EvaluateMessage extends React.Component{
    constructor(props){
        super(props);

        this.state = {
            evaluateData1: {
                avatarUrl: '',
                userName: '',
                evaluateTime: '',
                evaluateContent: '',
                evaluatePic1: '',
                evaluatePic2: '',

                /*特殊项*/
                specialItem: {
                    numOfStars: '',
                    item_score: '',
                    env_score: '',
                    svr_score: ''
                },

                /*评论回复项*/
                evaluateReply: {
                    // like_list返回一个对象
                    // like_list为空时是个数组
                    likeReply: [],
                    // "21140": {
                    //     "nickname": "居居爱FUFU",
                    //     "user_id": 21140,
                    //     "user_avatar": "url"
                    // }
                    //reply_list返回数组
                    messageReply: []
                    // {
                    //     "nickname": "我在人民广场吃炸猪",
                    //     "desc": "早没看见你的评论啊，找了一下午没找到。",
                    //     "reply_time": "15-09-26 18:22 ",
                    //     "avatar": "url",
                    //     "reply_target": ""
                    // }
                }
            }
        }
    }


    componentDidMount(){
        let evaluateData = this.props.evaluateData;
        this.setState({
            evaluateData1: {
                avatarUrl: evaluateData.avatar,
                userName: evaluateData.nickname,
                evaluateTime: evaluateData.comment_time,
                evaluateContent: evaluateData.desc,
                evaluatePic1: evaluateData.pic_small,
                evaluatePic2: evaluateData.pic_large,

                /*特殊项*/
                specialItem: {
                    numOfStars: evaluateData.star,
                    item_score: evaluateData.item_score,
                    env_score: evaluateData.env_score,
                    svr_score: evaluateData.svr_score
                },

                /*评论回复项*/
                evaluateReply: {
                    // like_list返回一个对象
                    // like_list为空时是个数组
                    likeReply: evaluateData.like_list,
                    // "21140": {
                    //     "nickname": "居居爱FUFU",
                    //     "user_id": 21140,
                    //     "user_avatar": "url"
                    // }
                    //reply_list返回数组
                    messageReply: evaluateData.reply_list
                    // {
                    //     "nickname": "我在人民广场吃炸猪",
                    //     "desc": "早没看见你的评论啊，找了一下午没找到。",
                    //     "reply_time": "15-09-26 18:22 ",
                    //     "avatar": "url",
                    //     "reply_target": ""
                    // }
                }
            }
        });

    }

    componentWillReceiveProps(nextProps){
        let evaluateData = nextProps.evaluateData;
        this.setState({
            evaluateData1: {
                avatarUrl: evaluateData.avatar,
                userName: evaluateData.nickname,
                evaluateTime: evaluateData.comment_time,
                evaluateContent: evaluateData.desc,
                evaluatePic1: evaluateData.pic_small,
                evaluatePic2: evaluateData.pic_large,

                /*特殊项*/
                specialItem: {
                    numOfStars: evaluateData.star,
                    item_score: evaluateData.item_score,
                    env_score: evaluateData.env_score,
                    svr_score: evaluateData.svr_score
                },

                /*评论回复项*/
                evaluateReply: {
                    // like_list返回一个对象
                    // like_list为空时是个数组
                    likeReply: evaluateData.like_list,
                    // "21140": {
                    //     "nickname": "居居爱FUFU",
                    //     "user_id": 21140,
                    //     "user_avatar": "url"
                    // }
                    //reply_list返回数组
                    messageReply: evaluateData.reply_list
                    // {
                    //     "nickname": "我在人民广场吃炸猪",
                    //     "desc": "早没看见你的评论啊，找了一下午没找到。",
                    //     "reply_time": "15-09-26 18:22 ",
                    //     "avatar": "url",
                    //     "reply_target": ""
                    // }
                }
            }
        });

    }

    render(){
        /*评论获取的json数据*/
        // "comment_id": 4,
        //     "nickname": "Doris翼寻寻",
        //     "avatar": "https://p1.meituan.net/userheadpicbackend/0340e4cee2fbbe7d6883d14c4ed07ae5125097.jpg%4048w_48h_1e_1c_1l%7Cwatermark%3D0",
        //     "star": "3",
        //     "item_score": 3,
        //     "env_score": 3,
        //     "svr_score": 3,
        //     "desc": "miss&nbsp;SIXTY的童装哎，<br><br>不知道和成人装是不是一个工厂的，<br><br>蛮喜欢她家成人的衣服了，<br><br>童装比较偏男生多一点，<br><br>我家几个都是表妹侄女，所以穿的不是很多，╮(╯▽╰)╭",
        //     "comment_time": "12-12-31",
        //     "pic_large": [],
        //     "pic_small": [],
        //     "like_list": {
        //     "2522": {
        //         "nickname": "小妖1221",
        //             "user_id": 2522,
        //             "user_avatar": "https://p1.meituan.net/userheadpicbackend/5e932197c20a17be25f3031a46b417771084746.jpg%4048w_48h_1e_1c_1l%7Cwatermark%3D0"
        //     },
        //     "5262": {
        //         "nickname": "洛滟凝蕾",
        //             "user_id": 5262,
        //             "user_avatar": "https://p0.meituan.net/userheadpicbackend/46d4b286ec8ba4865012430a0886c87032262.jpg%4048w_48h_1e_1c_1l%7Cwatermark%3D0"
        //     },
        //     "17799": {
        //         "nickname": "Angela平平",
        //             "user_id": 17799,
        //             "user_avatar": "https://p1.meituan.net/userheadpicbackend/26cf3cdff2a9f6c9ab974eed907abdd5119752.jpg%4048w_48h_1e_1c_1l%7Cwatermark%3D0"
        //     }
        // },
        // "reply_list": []


        return(
            <div className="evaluateDetailsContainer">
                <div className="evaluateTitle">
                    <img className="avatarSizeL avatarRadius" src={this.state.evaluateData1.avatarUrl} />
                    <span className="userName userNameFontL userNameColor">{this.state.evaluateData1.userName}</span>
                    <div className="evaluateTimeBox">
                        <span className="evaluateTime specialItemFont">{this.state.evaluateData1.evaluateTime}</span>
                    </div>
                </div>

                <div className="evaluateContent">
                    <article className="evaluateArticle">
                        {/*长泰广场位于浦东新区张江板块，2号线地铁上盖，地理位置优越，*/}
                        {/*交通网络四通八达，车行30分钟即可融入人民广场商圈、浦东陆家嘴金融中心。*/}
                        {/*长泰广场总建筑面积32万平方米，是区域内的超级商业综合体。*/}
                        {this.state.evaluateData1.evaluateContent}
                    </article>

                    {/*评价图片*/}
                    <EvaluatePic picUrl={this.state.evaluateData1.evaluatePic1} />
                    {/*特殊评价*/}
                    {/*商品，环境，服务，星级*/}
                    <EvaluateSpecialItem specialItem={this.state.evaluateData1.specialItem} />
                    {/*评价回复*/}
                    <EvaluateReply evaluateReply={this.state.evaluateData1.evaluateReply}  />
                </div>
            </div>
        )
    }
}

export default EvaluateMessage;